<template>
  <div>
    <div>
      <!-- 操作记录 -->
      <Modal
        @on-cancel="cancel"
        width="55%"
        v-model="operationRecordModal"
        title="操作记录"
      >
        <div>
          <Row>
            <Table
              :loading="loading"
              border
              :columns="operationRecordColumns"
              :data="operationRecordList"
              ref="table"
              sortable="custom"
            >
            </Table>
          </Row>
          <div style="width: 100%; height: 20px"></div>
          <Row type="flex" justify="end" class="page">
            <Page
              :current="operationRecordPageNumber"
              :total="operationRecordTotal"
              :page-size="operationRecordPageSize"
              @on-change="operationPage"
              @on-page-size-change="operationSize"
              :page-size-opts="[10, 20, 50]"
              size="small"
              show-total
              show-elevator
              show-sizer
            ></Page>
          </Row>
        </div>

        <div slot="footer">
          <!-- <Button @click="operationRecordModal = false">取消</Button>
          <Button
            :loading="loadingbut"
            type="primary"
            @click="auditRejectDetermine"
            >确定</Button
          > -->
        </div>
      </Modal>
    </div>
  </div>
</template>

<script>
import { getOperationLogList } from "@/api/index";
export default {
  data() {
    return {
      operationRecordModal: this.operationRecordModal,
      operationRecordModal: false, //操作记录
      operationRecordPageNumber: 1, //页码
      operationRecordPageSize: 10, //条数
      operationRecordTotal: 0, //总数
      operationRecordList: [], //数据
      operationRecordColumns: [
        {
          title: "#",
          type: "index",
          width: 60,
        },
        {
          title: "操作时间",
          key: "createTime",
          minWidth: 180,
          sortable: false,
        },
        {
          title: "操作人",
          key: "nickName",
          minWidth: 130,
          sortable: false,
          tooltip: true,
        },
        {
          title: "操作账号",
          key: "userName",
          minWidth: 180,
          sortable: false,
          tooltip: true,
        },
        {
          title: "操作事件",
          key: "name",
          minWidth: 450,
          sortable: false,
          tooltip: true,
        },
      ], //列表
    };
  },
  props: {
    operationRecordModal: {
      type: Boolean,
      default: false,
    },
    operationRecordData: {
      type: Object,
      default: "",
    },
  },
  watch: {
    operationRecordModal(val) {
      if (val) {
        this.operationRecordClick();
      }
    },
    operationRecordData(val) {},
  },
  created() {},
  mounted() {
    //
  },
  methods: {
    // 操作记录
    operationRecordClick() {
      this.operationRecordModal = true;
      let data = {
        pageNumber: this.operationRecordPageNumber,
        pageSize: this.operationRecordPageSize,
        logType: this.operationRecordData.logType,
        oid: this.operationRecordData.oid,
      };
      getOperationLogList(data).then((res) => {
        if (res.success) {
          if (res.result.records) {
            this.operationRecordList = res.result.records;
            this.operationRecordTotal = res.result.total;
          } else {
            this.operationRecordList = [];
          }
        }
      });
    },
    // 操作记录页码
    operationPage(v) {
      this.operationRecordPageNumber = v;
    },
    // 操作记录条数
    operationSize(v) {
      this.operationRecordPageSize = v;
    },
    // 关闭
    cancel() {
      this.$emit("operationRecordEnd", this.operationRecordModal);
    },
  },
};
</script>

<style lang="less">
</style>